

<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>
<%@page import="com.ckeditor.CKEditorConfig"%>
<!DOCTYPE html>
<html:html lang="true">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><bean:message key="welcome.title" /></title>
<link
	href="css/mini3537.css?files=reset,common,form,standard,960.gs.fluid,simple-lists,block-lists,planning,table,calendars,wizard,gallery"
	rel="stylesheet" type="text/css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link rel="icon" type="image/png" href="favicon-large.png">
<script type="text/javascript"
	src="js/miniab15.php?files=html5,jquery-1.4.2.min,old-browsers,jquery.accessibleList,searchField,common,standard,jquery.tip,jquery.hashchange,jquery.contextMenu,list"></script>

<!-- FCK editor -->
<!--
        <script src="ckeditor/ckeditor.js" type="text/javascript"></script>        
        <link rel="stylesheet" type="text/css" href="ckeditor/skins/kama/editor.css">
        <script type="text/javascript" src="ckeditor/lang/vi.js"></script>
        <script type="text/javascript" src="ckeditor/plugins/styles/styles/default.js"></script>
        <script type="text/javascript" src="ckeditor/plugins/docprops/plugin.js"></script>
        -->

<html:base />


</head>
<body>
	<%@ include file="/Header.jsp"%>

	<!-- ####################                  Vertical Menu                    ########################## -->
	<%@ include file="/verticalmenu.jsp"%>

	<!-- ####################                  Vertical Menu                    ########################## -->

	<!-- *************************************** Content *************************************************** -->
	<section class="grid_9">
		<div class="block-border">
			<div class="block-content">
				<!-- We could put the menu inside a H1, but to get valid syntax we'll use a wrapper -->
				<div class="h1 with-menu">
					<h1>Web stats</h1>
				</div>

				<div class="block-controls">

					<ul class="controls-tabs js-tabs same-height with-children-tip">
						<li><a href="#tab-stats" title="Charts"><img
								src="images/icons/web-app/24/Bar-Chart.png" width="24"
								height="24"></a></li>
						<li><a href="#tab-comments" title="Comments"><img
								src="images/icons/web-app/24/Comment.png" width="24" height="24"></a></li>
						<li><a href="#tab-medias" title="Medias"><img
								src="images/icons/web-app/24/Picture.png" width="24" height="24"></a></li>
						<li><a href="#tab-users" title="Users"><img
								src="images/icons/web-app/24/Profile.png" width="24" height="24"></a></li>
						<li><a href="#tab-infos" title="Informations"><img
								src="images/icons/web-app/24/Info.png" width="24" height="24"></a></li>
					</ul>

				</div>

				<html:form styleClass="form" action="doc.do" styleId="doc"
					enctype="multipart/form-data">

					<fieldset class="grey-bg">
						<legend>
							<a href="#">Options</a>
						</legend>

						<div class="float-left gutter-right">
							<label for="stats-period">Documents Name</label> <span
								class="input-type-text"> <html:text name="DocForm"
									property="name" styleId="nameDoc"></html:text></span>
						</div>
						<!-- Cac loai tai lieu -->
						<div class="float-left gutter-right">
							<label for="stats-period">Type of Document</label>

							<html:select name="DocForm" property="id_CatalogyDoc"
								styleId="idCatelogeDoc" onchange="selectCatelogy(this)">
								<html:options collection="arrCatelogyDoc" property="id"
									labelProperty="name" />
							</html:select>

						</div>
						<!-- Tai lieu ve toa nha -->
						<div class="float-left gutter-right" id="idBuilt">
							<label for="stats-period">Document Of This Buil</label>

							<html:select name="DocForm" property="id_Built"
								styleId="idBuilt2">

								<html:options collection="arrBuilts" property="id"
									labelProperty="name" />
							</html:select>

						</div>
						<!-- Tai lieu ve dat cat -->
						<div class="float-left gutter-right" id="idLand">
							<label for="stats-period">Document Of This Land</label>

							<html:select name="DocForm" property="id_Land" styleId="idLand2">

								<html:options collection="arrLands" property="id"
									labelProperty="name" />
							</html:select>

						</div>

						<!-- file dinh kem -->
						<div class="float-left gutter-right" id="fileAttch">
							<label for="stats-period">File Attach</label> <span
								class="input-type-text"
								style="padding-left: 5px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px;">
								<html:file property="attachFile" style="height: 20px;" />
							</span>

						</div>

						<div class="float-left gutter-right" id="fileAttch2">
							<label for="stats-period">Down Load Attach File</label>
							<button type="button" onclick="downFile()" style="height: 29px;">DownLoad</button>
						</div>



						<div class="float-left gutter-right">
							<br> <span class="input-type-text"> <label
								for="stats-period">Note</label> <html:textarea property="note"
									styleId="nodeDoc" name="DocForm"
									style="margin-top: 2px; margin-bottom: 2px; height: 67px; margin-left: 2px; margin-right: 2px; width: 459px; " /></span>
						</div>


						<div class="float-left gutter-right">
							<br> <span class="input-type-text"> <label
								for="editor1">Content</label> <html:textarea property="content"
									styleId="editor1" styleClass="ckeditor"
									style="margin-top: 2px; margin-bottom: 2px; height: 243px; margin-left: 2px; margin-right: 2px; width: 747px; " />
							</span>
							<%
								CKEditorConfig settings = new CKEditorConfig();
										settings.addConfigValue(
												"toolbar",
												"[['Styles','Format','Font','FontSize' ],[ 'Bold','Italic','Strike','-','RemoveFormat' ],"
														+ "[ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ],[ 'TextColor','BGColor' ] ]");
							%>
							<ckeditor:replace replace="editor1" basePath="/NTB/ckeditor/"
								config="<%=settings%>" />
						</div>



					</fieldset>


					<ul class="message no-margin">

						<button type="button" class="red" onclick="cancel()">Cancel</button>
						<button type="reset" class="grey">Reset</button>
						<button type="button" onclick="saveDocument()" id="saveDoc">
							<img src="images/icons/fugue/tick-circle.png" width="16"
								height="16"> Save
						</button>
					</ul>
				</html:form>
			</div>
		</div>
	</section>


	<!-- *************************************** Content *************************************************** -->
	</article>
	<!--Footer-->
	<%@ include file="/Footer.jsp"%>
	<!-- Footer -->
</body>
</html:html>

<script language="javascript">
    var type = '<%=(String) request.getAttribute("type")%>';   
    id = '<%=(String) request.getAttribute("id")%>';
    down = '<%=(String) request.getAttribute("down")%>';

	//control selecty
	selectCatelogyDoc = document.getElementById("idCatelogeDoc");
	selectBuilt = document.getElementById("idBuilt2");
	selectLand = document.getElementById("idLand2");
	// id
	idLand = selectLand.value;
	idBuilt = selectBuilt.value;
	idCateloge = selectCatelogyDoc.value;

	//save du lieu
	function saveDocument() {
		if (type == 'add') {
			document.getElementById("doc").action = 'doc.do?method=addDoc&type=add';
			document.getElementById("doc").submit();
		} else {
			document.getElementById("doc").action = 'doc.do?method=editDocuments&type=edit&id='
					+ id;
			document.getElementById("doc").submit();
		}
	}

	// an hien cac the select
	function selectCatelogy(chosenoption) {
		//this refers to "selectmenu"
		if (chosenoption.options[chosenoption.selectedIndex].value == "built") {
			document.getElementById('idBuilt').style.display = 'inline';
			document.getElementById('idLand').style.display = 'none';
		} else if (chosenoption.options[chosenoption.selectedIndex].value == "land") {
			document.getElementById('idLand').style.display = 'inline';
			document.getElementById('idBuilt').style.display = 'none';
		} else {
			document.getElementById('idLand').style.display = 'none';
			document.getElementById('idBuilt').style.display = 'none';
		}

	}

	// load du lieu cho cac the select
	function loadTypeOfDoc() {
		for ( var i = 0; i < selectCatelogyDoc.length; i++) {
			if (selectCatelogyDoc.options[i].text == idCateloge)
				selectCatelogyDoc.selectedIndex = i;
		}
		if (idCateloge == 'built') {
			for ( var i = 0; i < selectBuilt.length; i++) {
				if (selectBuilt.options[i].text == idBuilt)
					selectBuilt.selectedIndex = i;
			}
		} else if (idCateloge == 'land') {
			for ( var i = 0; i < selectLand.length; i++) {
				if (selectLand.options[i].text == idLand)
					selectLand.selectedIndex = i;
			}
		}
	}

	// an cac control 
	function hiddenControl() {
		if (type == 'detail') {
			document.getElementById("nameDoc").disabled = true;
			document.getElementById("idCatelogeDoc").disabled = true;
			document.getElementById("idBuilt2").disabled = true;
			document.getElementById("idLand2").disabled = true;
			document.getElementById("fileAttch").style.display = 'none';	
			document.getElementById("nodeDoc").disabled = true;
			document.getElementById("editor1").disabled = true;
			document.getElementById("saveDoc").disabled = true;
			if(down == 'down'){
				document.getElementById("fileAttch2").style.display = 'inline';
			}else{
				document.getElementById("fileAttch2").style.display = 'none';
			}
		} else {
			document.getElementById("fileAttch2").style.display = 'none';
		}
	}

	function cancel() {
		document.getElementById("doc").action = 'doc.do?method=getAllDocument';
		document.getElementById("doc").submit();
	}
	function downFile(){
		document.getElementById("doc").action = 'doc.do?method=downloadFile&id='+id;
		document.getElementById("doc").submit();
	}

	function loadForm() {
		selectCatelogy(selectCatelogyDoc);
		loadTypeOfDoc();
		hiddenControl();
	}
</script>